<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
	<head>
				<base href="<%=basePath %>" />
		<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="plugins/layui/css/layui.css" media="all" />
		<link rel="stylesheet" href="css/global.css" media="all" />
	</head>

	<body>
		<div class="layui-layout layui-layout-admin" style="border-bottom: solid 5px #1aa094;">
			<div id="avgsex" style="width: 100%; height: 500px;"></div>
			<script type="text/javascript" src="plugins/layui/layui.js"></script>
			<script type="text/javascript" src="plugins/echars/echarts-all.js"></script>
			<script >
			layui.use('layer', function() {
				var $ = layui.jquery,
					layer = layui.layer; //获取当前窗口的layer对象
		     // 基于准备好的dom，初始化echarts实例
	        var myChart = echarts.init(document.getElementById('avgsex'));

	        // 指定图表的配置项和数据
	        var option = {
	            title: {
	                text: '公司各部门男女比例'
	            },
	            tooltip: {},
	            legend: {
	                data:['人数']
	            },
	            xAxis: {
	                data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
	            },
	            yAxis: {},
	            series: [{
	                name: '销量',
	                type: 'bar',
	                data: [5, 20, 36, 10, 10, 20]
	            }]
	        };
	        function loadbar(){
	    	        myChart.clear();  
	        myChart.showLoading({text: '正在努力的读取数据中...'});  
	        $.ajax({type: 'get',url:  'avgsex',
				//data: data.field,
				async: false,dataType: 'json',success: function(result, status, xhr) {
	            if (data.success) {  
	            	myChart.setOption(data, true);  
	            	myChart.hideLoading();  
	            } else {  
	                alert('提示', data.msg);  
	            }  
	        }
	        });  
	        }
	        loadbar();
	        // 使用刚指定的配置项和数据显示图表。
	       // myChart.setOption(option);

			});
			</script>
	
		</div>
	</body>

</html>